<template>
  <div id="app">

    <img id="image"  :src="url" >
    <div id="div1">
      <span style="margin-left: -80%">{{time}}</span>
    </div>
    <div id="div2">
        <ul>
          <li class="ul1"><router-link to="/Design" style="text-decoration: none;">设计</router-link></li>
          <li class="ul2"><router-link to="/Bazaar" style="text-decoration: none;">市场</router-link></li>
          <li class="ul2"><router-link to="/Develop" style="text-decoration: none;">开发</router-link></li>
        </ul>
    </div>
    <router-view></router-view>
  </div>
</template>

<script>
import Design from "./components/Design";


let aData = new Date();
let dateValue = aData.getHours() + ":" + (aData.getMinutes()<10 ? '0'+new Date().getMinutes() : new Date().getMinutes());
export default {
  name: 'App',
  data(){
    return{
      text:"父类到子类",
      time: dateValue,
      url:"https://tse1-mm.cn.bing.net/th/id/R-C.21d29eac1d137bd64e19b244e355f2d3?rik=RTW40tovTFUirw&riu=http%3a%2f%2fimage.qianye88.com%2fpic%2f113ea825a8650dd0a909ad060ce31896&ehk=tdhD5%2fUfKEU6tbz%2bNoUSDe1LwI9ynnOSKDvwPTZ5mjM%3d&risl=&pid=ImgRaw&r=0"
    }
  },
  components:{Design}
}
</script>

<style>
#app{
  margin: 0px;
  padding: 0px;
  text-align: center;
}
#image{
  width : 100%;
  height: 200px;
}
#div1{
  color: aliceblue;
  margin-top: -48%;
}
#div2{
  margin-top: 45%;
  margin-bottom: 5%;
}
ul{
  list-style: none;
  display: block;

}
li{
  float: left;
}
.ul2{
  margin-left: 30%;
}
</style>
